<template>
	<view>
		<view class="item" v-for="(item, index) in seniclist" :key="index" @tap="toDetails(item.objectId)">
			<view class="pic"></view>
			<image :src="item.img" mode="aspectFill"></image>
			<view class="msg">
				<view class="name">{{item.name}}</view>
				<view class="intro">{{item.intro}}</view>
			</view>
		</view>
	</view>
</template>

<script setup>
import { onLoad } from "@dcloudio/uni-app";
import { ref } from 'vue';
import { CONFIG } from "../../utils/config";

const seniclist = ref([]);

onLoad(() => {
	getSenic(1);
});

async function getSenic() {
	let query = {
		"type": "1"
	};
	let res = await uni.$get(CONFIG.leanCloud_url + "/1.1/classes/senicltem", {
		where: query
	});
	if (res.statusCode == 200) {
		seniclist.value = res.data.results;
	}
}

function toDetails(id) {
	uni.navigateTo({
		url: "/pages/playDetails/playDetails?id=" + id
	});
}
</script>
<style>
.view {
  padding: 10px;
}

.item {
  background-color: #fff;
  border-radius: 8px;
  margin-bottom: 15px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}

.pic {
  width: 100%;
  height: 200px;
}

image {
  width: 100%;
  height: 100%;
  object-fit: cover; /* 确保图片填充整个容器而不变形 */
}

.msg {
  padding: 15px;
}

.name {
  font-size: 18px;
  color: #333;
  font-weight: bold;
  margin-bottom: 5px;
}

.intro {
  font-size: 14px;
  color: #666;
  line-height: 1.5;
}
</style>
